.data01-border{
  padding: 15px 10px 15px 10px;
  width: calc(100% - 20px);
  height: calc(100% - 30px);
}

.data01R-border{
  padding: 15px 3px 15px 10px;
  width: calc(100% - 12px);
  height: calc(100% - 30px);
}

.data-left-01{
  height: 16vh;
}

.center-left-01{
  height: 12vh;
}

.data-left-02{
  height: 69vh;
}

.center-left-02{
  height: 65vh;
}

.data-right-01{
  height: 53vh;
}

.content_right_01{
  height: 49vh;
}

.data-right-02{
  height: 32vh;
}

.content_right_02{
  height: 28vh;
}
.baseLift{
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.baseLift li{
  width: 30%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.baseLift li i{
  width: 48px;
  height: 48px;
  display: flex;
  background: url("/static/img/lift(2).svg");
}

.baseLift li:nth-child(2) i{
  background: url("/static/img/yunxing.svg");
}

.baseLift li:nth-child(3) i{
  background: url("/static/img/warn.svg");
}



.baseLiftData p{
  font-size: 14px;
  font-weight: 400;
  color: rgba(255,255,255,0.8);
}

.baseLiftData b{
  font-size: 24px;
  font-weight: bold;
  color: #FFFFFF;
  line-height: 30px;
}

.baseLiftData span{
  color: rgba(255,255,255,0.8);
  font-size: 14px;
}

.baseLift li:nth-child(3) .baseLiftData b{
  color: #FF386B;
}

.baseLift li:nth-child(3) .baseLiftData span{
  color: #FF386B;
}
.liftStateList{
  height: 54vh;
  width: 22vw;
  display: flex;
  flex-wrap: wrap;
}
.liftStateList li{
  width: 20%;
  height: 45%;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.liftName{
  width: 64px;
  height: 24px;
  background: rgba(22,152,252,0.3);
  border-radius: 2px 2px 2px 2px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.liftName b{
  font-size: 14px;
  font-weight: 400;
  color: #FFFFFF;
  line-height: 20px;
}

.liftStateImg{
  width: 24px;
  height: 200px;
  top: 1.5vh;
  background: rgba(2,49,100,0.3);
  border-radius: 0px 0px 0px 0px;
  opacity: 1;
  border: 1px solid rgba(22,152,252,0.6);
  position: relative;
}

.liftNowPosition{
  width: 200%;
  height: 20px;
  display: flex;
  position: absolute;
  left: -100%;
  bottom: 0;
}

.liftStateImg .liftNowPositionText{
  width: 50%;
  height: 100%;
  background: rgba(21,153,253,0.3);
  display: flex;
  justify-content: center;
  align-items: center;
}
.liftStateImg .liftNowPositionText p{
  font-size: 10px;
  font-weight: 400;
  color: #FFFFFF;
  line-height: 14px;
}
.liftStateColor{
  width: 50%;
  height: 100%;
  background: #1599FD;
}

.separate{
  display: flex;
  margin: 2vh 0;
  width: 416px;
  height: 4px;
  background: linear-gradient(90deg, rgba(31,198,255,0.6) 0%, rgba(31,198,255,0) 100%);
}

/*电梯运行状态故障样式*/
.liftNowPositionFault.liftNowPosition .liftNowPositionText{
  background: rgba(255,56,107,0.3);
}
.liftNowPositionFault.liftNowPosition .liftStateColor{
  background: #FF386B;
}

.liftNowPositionWarn.liftNowPosition .liftNowPositionText{
  background: rgba(237,169,21,0.3);
}

.liftNowPositionWarn.liftNowPosition .liftStateColor{
  background: #EDA915;
}

/*假数据模拟电梯运行楼层*/
.liftStateList li .liftStateImg .liftNowPosition{
  bottom: 0%;
  transition: all 2s;
}
.liftStateList li:nth-child(2) .liftStateImg .liftNowPosition{
  bottom: 20%;
}

.liftStateList li:nth-child(3) .liftStateImg .liftNowPosition{
  bottom: 40%;
}
.liftStateList li:nth-child(4) .liftStateImg .liftNowPosition{
  bottom: 30%;
}
.liftStateList li:nth-child(5) .liftStateImg .liftNowPosition{
  bottom: 70%;
}
.liftStateList li:nth-child(7) .liftStateImg .liftNowPosition{
  bottom: 25%;
}
.liftStateList li:nth-child(8) .liftStateImg .liftNowPosition{
  bottom: 30%;
}
.liftStateList li:nth-child(9) .liftStateImg .liftNowPosition{
  bottom: 45%;
}
.liftStateList li:nth-child(10) .liftStateImg .liftNowPosition{
  bottom: 65%;
}
.liftStateList li:nth-child(11) .liftStateImg .liftNowPosition{
  bottom: 10%;
}

.liftTip{
  display: flex;
  width: 12vw;
  height: 2vh;
  position: absolute;
  top: 1.5vh;
  right: 0.5vw;
  align-items: center;
}

.liftTip li{
  width: 33.3%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.liftTip li i{
  width: 10px;
  height: 10px;
  background: #1599FD;
  border-radius: 100px 100px 100px 100px;
}
.liftTip li:nth-child(2) i{
  background: #FF386B;
}
.liftTip li:nth-child(3) i{
  background: #EDA915;
}

.liftTip li b{
  font-size: 10px;
  font-weight: 400;
  color: rgba(255,255,255,0.7);
  line-height: 14px;
  padding-left: 0.3vw;

}


/*右上角*/
.DeviceStatus-box{
  display: flex;
  position: relative;
}
.DeviceStatus-picture{
  width: 100px;
  height: 100px;
  margin: 1vw 1vw 0 0.5vw;
}
.deviceStatusList li {
  height: 20px;
  width: 267px;
}
.deviceStatusList li>div {
  width: 100%;
  height: 100%;
  display: flex;
}
.deviceStatusList li:first-child {
  margin-top: 2.3vh;
}
.deviceStatusList li:nth-child(2){
  margin: 1.8vh 0;
}
.deviceStatusList li i{
  width: 4px;
  height: 20px;
  background: #23C7FF;
  display: block;
}
.deviceStatusList li:nth-child(2) i{
  background: #FF386B;
}
.deviceStatusList li:nth-child(3) i{
  background: #FFFFFF;
}
.deviceStatusList li div{
  display: flex;
  justify-content: space-between;
  width: 100%;
  height: 100%;
}
.deviceStatusList li p{
  height: 20px;
  font-size: 14px;
  font-weight: 400;
  color: rgba(255,255,255,0.7);
  line-height: 20px;
  padding-left: 0.5vw;
}
.deviceStatusList li:first-child p b{
  color: #23C7FF;
}
.deviceStatusList li:nth-child(2) p b{
  color: #FF386B;
}
.deviceStatusList li:last-child p b{
  color: #FFFFFF;
}
.deviceStatusList li span{
  font-size: 12px;
  font-weight: 500;
  color: rgba(255,255,255,0.9);
  line-height: 20px;
}
.deviceStatusList li span b{
  color: rgba(255,255,255,0.6);
  font-size: 8px;
}
.deviceStatusList li h2{
  margin-top: 0.2vh;
  display: block;
  width: 100%;
  height: 1px;
  border-top: 1px dashed rgba(255,255,255,0.4);
}
 .picture-background{
  width: 48px;
  height: 48px;
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.3);
   border-radius: 50%;
   position: absolute;
   display: flex;
   justify-content: center;
   align-items: center;
   top: 35%;
   left: 1.8vw;
}
 /* .picture-background i{
   display: flex;
  width: 24px;
  height: 24px;
  background: url("/static/img/weixiu1.svg") no-repeat center;
   background-size: 100%;
   position: absolute;
} */

 .EmergencyEvents{
   height: 30vh;
   width: 100%;
 }
.MaintenanceRecords{
  height: 100%;
  width: 100%;
}
.liftWindowTitle{
  height: 2.5925926vh;
  width: 6.66667vw;
}
.liftWindowBox{

}
.liftWindow{
  position: absolute;
  background: red;
  top: 20%;
  left: 50%;
}
